<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>{$footcompany.web_site_title}</title>
    <meta name="keywords" content="{$footcompany.web_site_keyword}">
    <meta name="description" content="{$footcompany.web_site_description}">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="/static/index/css/plugins-2.2.css">
    <link rel="stylesheet" href="/static/index/css/theme-2.2.css">
    <link rel="stylesheet" href="/static/index/css/main.min.css">
    <link rel="stylesheet" href="/static/index/css/frontend.min.css">
    <link href="{$footcompany.web_site_ico}" type="image/x-icon" rel="shortcut icon" />
    <script src="/static/index/js/jquery.min1.js"></script>
</head>
<style>
    #toast-container {
        display: none;
        top:70px;
        position: fixed;
        z-index: 999999;
        pointer-events: none;
        text-align: center;
    }
    .green {
        border-color: #18bc9c !important;
        box-shadow: none;
    }
    .text-green{
        color:#18bc9c !important;
    }
    .red{
        border-color: #e74c3c !important;
        box-shadow: none;
    }
    .text-red{
        color:#e74c3c !important;
    }
    .n-icon {
        background-image: url(/static/index/picture/validator_default.png);
    }
</style>
<body>
{include file="../application/index/view/common/header.html" /}
 <div id="content-container" class="container">
    <div class="user-section login-section">
        <div class="logon-tab clearfix">
            <a class="" style="width:100%;">修改密码</a>
        </div>
        <div class="login-main">
            <form id="form6" onsubmit="return false" action="##" method="post">
                <input type="hidden" name="__token__" value="fd0f4c2511c8a8fef8cf8dc5f73010ae">                
                <div class="form-group">
                    <div class="controls">
                        <div class="row">
                        </div>
                        <div class="help-block"></div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label">手机号</label>
                    <label class="control-label required" style="float:right;color:#c33;display: none" id="mobile-msg"><span class="text-success"></span></label>
                    <div class="controls">
                        <input type="text" id="mobile" name="mobile" class="form-control input-lg" placeholder="手机号">
                        <p class="help-block"></p>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label">验证码</label>
                    <label class="control-label required" style="float:right;color:#c33;display: none" id="code-msg"><span class="text-success"></span></label>
                    <div class="controls">
                        <div class="input-group">
                            <input type="text" name="code" id="code" class="form-control input-lg" maxlength="6">
                            <span class="input-group-btn" style="padding:0;border:none;color:#fff;">
                                <a href="javascript:;" id="send" class="btn btn-info btn-captcha" data-type="mobile" data-title="验证码为6位数字" style="color:#fff;">发送验证码</a>
                            </span>
                        </div>
                        <p class="help-block"></p>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label">新密码</label>
                    <label class="control-label required" style="float:right;color:#c33;display: none" id="newpassword-msg"><span class="text-success"></span></label>
                    <div class="controls">
                        <input type="password" id="newpassword" name="newpassword" class="form-control input-lg" placeholder="密码必须6-30个字符">
                        <p class="help-block"></p>
                    </div>
                </div>
                <div class="form-group">
                    <button type="button" onclick="upnewpassword()" class="btn btn-primary btn-md btn-block">提交</button>
                </div>
            </form>
        </div>
    </div>
</div>
<!--为空提示框 -->
<div id="toast-container" class="toast-top-center">
<div class="toast toast-error" aria-live="assertive" >
    <div class="toast-message"></div>
</div>
</div>

<div class="layui-layer layui-layer-dialog layui-layer-border layui-layer-fast layui-layer-fast-msg layui-layer-hui" id="parent-msg" style="z-index: 19891021; top: 251.5px; left: 884.5px;display: none;">
    <div id="msg" class="layui-layer-content">错误</div>
</div>
<!-- 底部 -->
{include file="../application/index/view/common/foot.html" /}
<script>
//手机号名边框效果
$("#mobile").focusin(function(){
    if($(this).val() != ""){
        $(this).removeClass("red");
        $(this).addClass("green");
    }else{
        $(this).removeClass("green");
        $(this).addClass("red");
    }
})

$("#mobile").focusout(function(){
    var mobile = $(this).val();
    if(mobile != ""){
        var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/; 
        if(myreg.test(mobile)){
            $(this).removeClass("red");
            $(this).addClass("green");
            $('#mobile-msg').css('display','none');
            return false;
        }else{
            $('#mobile-msg').text('手机格式不正确');
            $('#mobile-msg').css('display','block');
            $(this).removeClass("green")
            $(this).addClass("red");
        }
    }else{
        $('#mobile-msg').text('手机号不能为空');
        $('#mobile-msg').css('display','block');
        $(this).removeClass("green")
        $(this).addClass("red");
    }
})

//验证码名边框效果
$("#code").focusin(function(){
    if($(this).val() != ""){
        $(this).removeClass("red");
        $(this).addClass("green");
    }else{
        $(this).removeClass("green")
        $(this).addClass("red");
    }
})

$("#code").focusout(function(){
    var code = $(this).val();
    if(code != ""){ 
        if(code.length == 6){
            $(this).removeClass("red");
            $(this).addClass("green");
            $('#code-msg').css('display','none');
            return false;
        }else{
            $('#code-msg').text('请输入6位验证码');
            $('#code-msg').css('display','block');
            $(this).removeClass("green")
            $(this).addClass("red");
        }
    }else{
        $('#code-msg').text('请输入6位验证码');
        $('#code-msg').css('display','block');
        $(this).removeClass("green")
        $(this).addClass("red");
    }
})
//密码
$("#newpassword").focusin(function(){
    if($(this).val() != ""){
        $(this).removeClass("red");
        $(this).addClass("green");
    }else{
        $(this).removeClass("green")
        $(this).addClass("red");
    }
})
$("#newpassword").focusout(function(){
    if($(this).val() != ""){ 
        $('#newpassword-msg').css('display','none');
        $(this).removeClass("red");
        $(this).addClass("green");
    }else{
        $('#newpassword-msg').text('密码不能为空');
        $('#newpassword-msg').css('display','block');
        $(this).removeClass("green");
        $(this).addClass("red");
    }
})

var InterValObj; //timer变量，控制时间
var curCount = 60;//当前剩余秒数
$("#send").click(function(){
    var mobile = $("#mobile").val();
    if(mobile == ""){
        $("#toast-container").show().delay(1000).hide(300);
        $(".toast-message").text('手机号不能为空');
        return false;
    }
    //验证是否为正确手机号
    var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/; 
    if(!myreg.test(mobile)){
        //手机格式不正确
        $("#toast-container").show().delay(1000).hide(300);
        $(".toast-message").text('手机号格式不正确');
        return false;
    }
    //
    $.ajax({
        //几个参数需要注意一下
        type: "POST",//方法类型
        url: "/my/send_sms" ,//url
        data: {mobile:mobile},
        beforeSend: function (){
            $('#send').text("");
            $('#send').text("发送中....");
        },
        success: function (result) {
            if (result.code == 200) {
                //设置button效果，开始计时
                $("#send").attr("disabled", "true");
                $("#send").text("");
                $("#send").text(curCount + "秒后重新获取");
                InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
            }else{
                $("#toast-container").show().delay(1000).hide(300);
                $(".toast-message").text(result.msg);
                $("#send").text("");
                $("#send").text("发送验证码");
            }
        },
        error : function() {
            $("#toast-container").show().delay(1000).hide(300);
            $(".toast-message").text('系统错误，请重试！');
        }
    });
})
//timer处理函数
function SetRemainTime() {
    if (curCount == 0) {               
        window.clearInterval(InterValObj);//停止计时器
        $("#send").removeAttr("disabled");//启用按钮
        $("#send").text("");
        $("#send").text("重新发送验证码");
        curCount = 60;
        //清除验证码。如果不清除，过时间后，输入收到的验证码依然有效 
        $.ajax({
        //几个参数需要注意一下
            type: "POST",//方法类型
            url: "/my/remove_code" ,//url
            data: {},
            dataType: 'json',
            success: function (result) {
                
            },
            error : function() {
            }
        });  
    } else {
        curCount--;
        $("#send").text("");
        $("#send").text(curCount + "秒后重新获取");
    }
}

function upnewpassword(){
    var mobile = $("#mobile").val();
    var code = $("#code").val();
    var newpassword = $("#newpassword").val();
    if(mobile == ""){
        $("#toast-container").show().delay(1000).hide(300);
        $(".toast-message").text('手机号不能为空');
        return false;
    }else{
        var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/; 
        if(!myreg.test(mobile)){
            //手机格式不正确
            $("#toast-container").show().delay(1000).hide(300);
            $(".toast-message").text('手机号格式不正确');
            return false;
        }
    }
    if(code == ""){
        $("#toast-container").show().delay(1000).hide(300);
        $(".toast-message").text('验证码不能为空');
        return false;
    }
    if(newpassword == ""){
        $("#toast-container").show().delay(1000).hide(300);
        $(".toast-message").text('密码不能为空');
        return false;
    }
    
    $.ajax({
        //几个参数需要注意一下
        type: "POST",//方法类型
        url: "/my/upnewpassword" ,//url
        data: $('#form6').serialize(),
        success: function (result) {
            if (result.code == 200) {
                window.location.href = '/user/login';
            }else{
                $("#parent-msg").show().delay(1000).hide(300);
                $("#msg").text(result.msg);
            }
        },
        error : function() {
            $("#parent-msg").show().delay(1000).hide(300);
            $("#msg").text('系统错误，请重试！');
        }
    });
}

</script>
</div>
</body>
</html>